<template>
  <div>
    <!--  价目列表中显示的审批详情  -->
    <el-dialog
      v-dialogDrag
      :title="$t('market.appDetails')"
      model
      :visible.sync="isAppDetails"
      :close-on-click-modal="false"
      width="800px"
      center
      append-to-body
      :before-close="beforeClose"
    >
      <div>
        <jc-table
          :table-data="tableData2"
          :table-header="tableHeader2"
          table-height="400px"
        >
          <template v-slot:billSlot="col">
            {{ col.scope.row.fstaffList.join(',') }}
          </template>
          <template v-slot:btnState="col">
            <el-tag v-if="col.scope.row.fstate===2">{{ $t('market.state1') }}</el-tag>
            <el-tag v-else-if="col.scope.row.fstate===1" type="success">{{ $t('market.consent') }}</el-tag>
            <el-tag v-else-if="col.scope.row.fstate===0" type="danger">{{ $t('market.consentNo') }}</el-tag>
          </template>
        </jc-table>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  props: {
    tableData2: {
      type: Array,
      default: function() {
        return []
      }
    }
  },
  data() {
    return {
      isAppDetails: true,
      tableHeader2: [
        { label: this.$t('market.approvalPro'), prop: 'fname' },
        { label: this.$t('market.approvUser'), type: 'bill', prop: 'fstaffList', width: '100' },
        { label: this.$t('market.assessing'), prop: 'fmodifier', width: '100' },
        { label: this.$t('market.assessingTime'), prop: 'fmodifydate' },
        { label: this.$t('market.note'), prop: 'fremarks', minWidth: '150' },
        { label: this.$t('shop.state'), type: 'state', prop: 'fstate', width: '100' }
      ]
    }
  },
  methods: {
    beforeClose() {
      this.$emit('close')
    }
  }
}
</script>
<style lang="scss" scoped>

</style>
